<template>
  <div>App</div>
  <p>{{ counterStore.count }}</p>
  <p>{{ counterStore.oddOrEven }}</p>
  <button @click="counterStore.count++">按钮1</button>
  <button @click="handleClick2">按钮2</button>
</template>

<script lang="ts" setup>
import { useCounterStore } from "./store/modules/counter";

const counterStore = useCounterStore();

// const { count } = counterStore; // 解构会失去响应式

const handleClick2 = () => {
  // 更新数据需要发送请求，使用action函数
  // counterStore.increment();
  // 更新一个数据
  // counterStore.count++;
  // 更新多个数据
  // counterStore.$patch({
  //   count: counterStore.count + 1,
  // });
  // 重置数据为初始化值
  counterStore.$reset();
};
</script>

<style></style>
